<template>
	<view>
		<view class="goods-list" v-if="list.length != 0">
			<view class="goods-item" v-for="item in list" @tap="topDetail(item.id)">
				<view class="goods-body">
					<image :src="item.goods_img"  class="goods-cover"></image>
					<view class="goods-name">{{item.name}}</view>
					<!-- <view class="goods-no">款号：M91111</view> -->
					<view class="goods-kuan">
						<view class="goods-no">款号：{{item.no}}</view>
						
					</view>
					<view class="goods-prices">
						<text class="rela-price">￥{{item.price}}</text>
						<!-- <text class="line-price">￥560.30</text> -->
						<view class="goods-customization" v-if="item.flag_name">
							<!-- <view class="ig"> -->
								<image lazy-load="true" src="../../static/image/produce/aptitude02.png" mode=""></image>
							<!-- </view> -->
							<view class="wz">
								{{item.flag_name}}
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="noPro" v-else>
			<image src="../../static/image/homePage/nopro.png" mode=""></image>
			<text>暂无商品</text>
		</view>
	</view>
</template>

<script>
	export default{
		props:{list : {}},
		data(){
			return {
			}
		},
		
		methods:{
			topDetail(id){
				uni.navigateTo({
					url:'/pages/goods/detail?goods_id='+id
				})
			}
		}
	}
</script>

<style lang="scss">
	.goods-model{
		position: fixed;
		top:700rpx;
		left:0;
		width: 100%;
		height:100%;
		background: #fff;
		z-index:9;
	}
	.noPro {
		text-align:center;
		image {
			display: block;
			width: 200upx;
			height: 150upx;
			margin: 200upx auto 60upx;
		}
		text {
			color: #000000;
			font-size: 32upx;
		}
	}
	.goods-list{overflow: hidden;width: 100%;margin-bottom: 20upx;}
	.goods-item{width: 50%;float: left;margin-top:20upx;}
	.goods-body{width: calc(100% - 20upx);margin: auto;}
	.goods-cover{width: 100%;border-radius: 10upx;display: block;margin-bottom: 20upx;height: 346upx;}
	.goods-name{width: 100%;height:40upx;line-height: 40upx;overflow: hidden; font-size: 14px;}
	.goods-no{font-size: 20upx;color:#b0b0b0;height: 40upx;line-height: 40upx;overflow: hidden;}
	.goods-prices{overflow: hidden;color:#000;height: 50upx;line-height: 50upx;font-weight: bold;}
	.rela-price{font-size: 32upx; font-style:normal;font-family: 'OTF'; margin-top: 10upx;}
	// .line-price{color :#999999;font-size: 24upx;margin-left: 20upx;text-decoration: line-through;font-weight: 600;}
	.goods-prices {
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items:center;
		// .goods-no{font-size: 20upx;color:#b0b0b0;height: 40upx;line-height: 40upx;overflow: hidden;}
		.goods-customization {
			width: 140upx;
			height: 40upx;
			background: url('../../static/image/produce/rectangle02.png') no-repeat;
			background-size: cover;
			display: flex;
			justify-content:center;
			align-items:center;
			image {
				width: 14upx;
				height: 20upx;
			}
			.wz {
				margin-left: 8upx;
				font-size: 20upx;
				color: #333333;
				height: 40upx;
				line-height: 42upx;
				overflow: hidden;
				}
	}
	}
</style>
